<template>
	<div>
		<div class="text">搜索“{{ inputValue }}”</div>
		<div
			class="search"
			v-for="item in getOnSearchList"
			:key="item.id"
			@click="handle(item.name)"
		>
			<van-icon name="search" />
			<span>{{ item.name }}</span>
		</div>
	</div>
</template>

<script>
import eventBus from "@/event-bus";
export default {
	props: {
		inputValue: String,
	},
	data() {
		return {};
	},
	computed: {
		getOnSearchList() {
			return eventBus.getOnSearchList.result?.songs;
		},
	},
	methods: {
		handle(value) {
			this.$emit("add", value);
		},
	},
};
</script>

<style scoped>
.search {
	width: 100%;
	height: 30px;
	line-height: 30px;
    padding-left: 12px;
    box-sizing: border-box;
}
.search > * {
	margin-left: 12px;
}
.text {
    font-size: 14px;
    padding: 12px;
    box-sizing: border-box;
}
</style>